<template>
    <div class="toast" v-show="isShow">
        <h4>{{ message }}</h4>
    </div>
</template>

<script>
export default {
    name: "PublicToast",
    // props:{
    //     message:{
    //         type:String,
    //         default:''
    //     },
    //     show:{
    //         type:Boolean,
    //         default:false
    //     }
    // },
    data(){
        return{
            message:'',
            isShow:false
        }
    },
    methods:{
        show(message,time){
            console.log('show被调用了')
            this.message=message
            this.isShow=true
            setTimeout(()=>{
                this.message=''
                this.isShow=false
            },time)
        }
    }
}
</script>

<style scoped>
.toast{
    position: fixed;
    left: 50%;
    top: 50%;
    background-color: rgba(0,0,0,.7);
    z-index: 999;
    transform: translate(-50%,-50%);
    color: white;
    font-size: 24px;
    padding: 10px;
    border-radius: 10px 10px;
}
</style>
